import "./index.scss";
import { Modal, Form, message } from "antd";
import { useNavigate, useLocation } from "react-router-dom";
import { useState } from "react";
import TextArea from "rc-textarea";
import http from "../../../utils/http";

const Particularstwo = () => {
  //时间转换
  const toDub = (n: any) => (n < 10 ? "0" + n : "" + n);
  //年月日时分秒
  const toTime = (date: any) => {
    const oTime = new Date(date);
    return (
      oTime.getFullYear() +
      "-" +
      toDub(oTime.getMonth() + 1) +
      "-" +
      toDub(oTime.getDate()) +
      " " +
      toDub(oTime.getHours()) +
      ":" +
      toDub(oTime.getMinutes()) +
      ":" +
      toDub(oTime.getSeconds())
    );
  };

  //取数据
  const state = useLocation();
  console.log("state", state.state);

  //返回
  const navigate = useNavigate();
  const back = () => {
    navigate("/home/Report");
  };

  // 未解决变已解决
  const [isModalOpen, setIsModalOpen] = useState(false);
  const [passForm] = Form.useForm();
  const solve = (record: any) => {
    passForm.setFieldsValue({ ...record });
    setIsModalOpen(true);
  };
  const handleOk = () => {
    const data1 = passForm.getFieldsValue(true);
    http({
      url: "/passReport",
      method: "post",
      data: {
        id: state.state.id,
        rpasstext: data1.rpasstext,
      },
    }).then((res: { [key: string]: any }) => {
      if (res.error == 0) {
        message.success("解决成功");
        setIsModalOpen(false);
        navigate("/home/Report");
      } else {
        message.error("解决失败");
      }
    });
  };
  const handleCancel = () => {
    setIsModalOpen(false);
  };

  return (
    <div className="student-detail">
      <div className="top">
        <div className="title" onClick={back}>
          举报信息
        </div>
        <div>&gt;</div>
        <div className="detail">详情</div>
      </div>

      <div className="hr"></div>
      <div className="context-box">
        <div className="context">
          <div className="tr">
            <div className="td1">举报人</div>
            <div className="td2">{state.state.rname}</div>
          </div>
          <div className="tr">
            <div className="td">联系方式</div>
            <div>{state.state.rphone}</div>
          </div>
          <div className="tr">
            <div className="td">举报对象</div>
            <div>{state.state.robject}</div>
          </div>
          <div className="tr">
            <div className="td">举报内容</div>
            <div>{state.state.rcontent}</div>
          </div>
          <div className="tr">
            <div className="td">举报时间</div>
            <div>{toTime(state.state.rtime)}</div>
          </div>
        </div>
      </div>
      <a className="but" onClick={solve}>
        已解决
      </a>

      <Modal
        title="解决结果"
        open={isModalOpen}
        onOk={handleOk}
        onCancel={handleCancel}
        okText={"确认"}
        cancelText={"取消"}
      >
        <Form form={passForm}>
          <Form.Item name="rpasstext">
            <TextArea
              rows={4}
              placeholder="请输入解决结果"
              className="textarea"
            />
          </Form.Item>
        </Form>
      </Modal>
    </div>
  );
};
export default Particularstwo;
